<template>
  <div class="box">
      <div class="bar">
         <router-link to="/headp/works">作品</router-link>
         <router-link to="/headp/collect">收藏</router-link>
         <router-link to="/headp/praise">赞过</router-link>
         <router-link to="/headp/apply">报名</router-link> 
      </div>
      <!-- <p v-show="bool"></p> -->
  </div>
</template>

<script>
export default {
    data(){
        return{
            bool:true
        }
    }
}
</script>

<style scoped>
.box{
    width: 100%;
    display: flex;
    justify-content: center;
}
.bar{
    width: 90%;
    margin-top: 0.3rem;
    display: flex;
    justify-content: space-evenly;
    /* border: 1px solid red; */
}
.bar a{
    font-size: 0.16rem;
    font-weight: bold;
    color: #2b2b2b;
}
.bar .router-link-active{
    font-size: 0.20rem;
    color: #2ea3d8;
    /* background: cyan; */
    /* box-shadow: 0rem 0rem 0.5rem 0.2rem cyan; */
}
/* .box p{
    width: 0.2rem;
    height: 0.15rem;
    background: royalblue;
} */
</style>